Demo

Svelte5

Reactive variables 3 ways:

0 doubled is 0 (derived)

0 doubled is 0 (derived by)

0 doubled is 0 ($effect)

Children (previously slots):

Dispatch Event

Snippets

John

Jill

Link

Default element styles demo

Pudding-hosted font previews

Image

img tag

background image

Dynamic Svelte Element

I am a h3 tag.

I am p tag.

Dynamic Svelte Component

I am component A and my favorite number is 42.

I am component B and my name is Russell.

MicroCMS

{"meta":{"title":"Title TK","description":"Description tk."},"body":[{"section":"intro","content":[{"type":"h4","value":"An h4 element with no attributes"},{"type":"text","value":"Some random text here, followed by an img tag."},{"type":"img","value":{"src":"../assets/demo/test.jpg","alt":"A cat"}},{"type":"Test","value":{"label":"I’m a custom component!","value":"50"}}]}]}

An h4 element with no attributes

Some random text here, followed by an img tag.

I’m a custom component!

Load Data

loading data...